<!DOCTYPE html>
<!--DanyHag 2017年5月3日20:10:41完成-->
<!--历时二个晚上二个中午-->
<!--仿超级QQ界面-->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>超级QQ</title>
    <style>
        .hui{
            color:#9a9a9a;
        }
        .header img{
            padding-bottom:15px;
        }
        .nav_top{
            clear: both;
            float: right;
            display: block;
        }
        .nav_top li{
            font-size:15px;
            float: left;
            padding-left: 10px;
        }
        .nav_top ul{
            display: block;
            list-style: none;
            margin: 43px 0 26px;
        }
        .nav{
            padding-bottom: 30px;
            height: 30px;
            background: #f60;
        }
        body{
            background: white;
        }
        .wrap{
            width:1002px;
            height: 1000px;
            padding-left: 200px;
        }
        .header{
            height: 150px;
        }
        .image{
            height: 311px;
            background: yellow url(img/img_bg.png);
            /*500-311*/
        }
        .main{
            height:450px;
            background: #2C2019;
            color:white;
        }
        .button{
            height: 80px;
            background: url(img/button_img.png) no-repeat;
            margin:0 260px;

        }
        .main a{
            display: block;
        }
        h2{
            padding-top: 20px;
            font-size:31px;
            line-height: 40px;
        }

        .logo{
            margin-top:10px;
            height: 60px;
        }
        .nav li{
            color:white;
            float: left;
            /*display: block;*/
            list-style: none;
            padding-left: 20px;
            font-family:'微软雅黑';
            font-size:21px;
            padding-top:10px;
        }
        a{
            text-decoration:none;
        }
        .main_neirong{
            float: left;
            width: 860px;
            display: inline;
            margin: 0 0 10px 0;
        }
        .bg_span{
            background: #d2822d;
            display: inline;
            float: left;
            font-size:17px;
            line-height: 17px;
            margin-right: 5px;
            padding-left:4px;
            width: 14px;
            margin-top:2px;
        }
        h2{
            margin-left:20px;
        }
        .main_text{
            width: 900px;
            height: 250px;
            margin: 0 0 0 20px;
        }
        .main_text ul{
            margin: 0;
            padding: 0;
            border: 0;
            list-style: none;

        }
        .main_neirong span{
            color: #ffdf1b;
        }
        .main a:hover{
            background: url(img/button2_img.png) no-repeat;
            margin: 0 260px;
        }
        .footer{
            padding-top: 40px;
            height: 120px;
            background-color: #16100c;;
            text-align: center;
            color:#b2b2b2;
            font-size:12px;
        }
        .footer ul{
            display:inline-block;
            margin: 0;
            padding: 0;
            clear: both;
            list-style: none;
        }
        .footer li{
            float: left;
            margin: 1px 0 0 0;
            font-size:12px;
            padding-right:6px;
        }
    </style>
</head>
<body>
<div class="wrap">
    <div class="header">
        <!--<a href="#" class="notblock"></a>-->
        <img src="http://imgcache.qq.com/vipstyle/vipportal/mqq/images/index/mqq-logo.png" alt="" class="logo">
        <div class="nav_top">
            <ul>
                <li class="hui">欢迎光临，请先<a href="javascript:;" style="color:#9a9a9a">[登陆]</a></li>
                <li style="color: #666;">客服专区</li>
                <li><img src="img/nav_top_vip.png" alt=""></li>
            </ul>
        </div>
        <div class="nav">
            <ul>
                <li>超级QQ</li>
                <li>特权升级</li>
                <li>个人中心</li>
            </ul>
        </div>
    </div>
    <div class="image">

    </div>
    <div class="main">
        <a class="button" href="javascript:;" ></a>
        <h2>活动规则：</h2>
        <div class="main_text">
        <ul>
        <li><span class="bg_span">1</span><p class="main_neirong">成功参与<span>“超级QQ升级QQ会员/超级会员”</span>的用户，可在本页面点亮超级QQ纪念版图标。</p></li>
        <li><span class="bg_span">1</span><p class="main_neirong">点亮纪念版图标后，登录电脑QQ，点击头像，在个人资料卡面板上可看到点亮的图标。</p></li>
        <li><span class="bg_span">1</span><p class="main_neirong">纪念版图标仅在电脑版QQ上显示，手机QQ上无显示。</p></li>
        <li><span class="bg_span">1</span> <p class="main_neirong">若点亮纪念版图标后，重新开通了超级QQ，则纪念版图标消失，超级QQ金色小手机图标将自动点亮。</p></li>
        <li><span class="bg_span">1</span> <p class="main_neirong">若因不可抗拒的因素，比如网络、作弊等非腾讯公司原因导致点亮图标出现异常情况，腾讯公司有权暂停或调整规则，腾讯公司拥有在法律许可范围内对活动解释的权力，如有问题<a style="color:#ffc343;text-decoration: underline;display: inline" href="javascript:;">请查看常见问题</a>。</p></li>
        </ul>
        </div>
    </div>
    <div class="footer">
        <ul>
            <a href="javascript:;" style="color:#b2b2b2;"><li>关于腾讯</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>About Tencent</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>服务条款</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"> <li>广告服务</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>商务洽谈</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"> <li>腾讯招聘</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"> <li>腾讯公益</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>客服中心</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>网站导航</li></a>
            <span style="float: left;font-size: 12px;padding-right: 4px;">|</span>
            <a href="javascript:;" style="color:#b2b2b2;"><li>版权所有</li></a>
        </ul>
        <p>Copyright &#169; 1998 - 2015 Tencent. All Rights Reserved.</p>
        <p>腾讯公司 版权所有</p>
    </div>
</div>
</body>
</html>